import React from 'react';

class Handler extends React.Component {
  state = {
    num: 4
  }
  handleClick = () => {
    this.setState({
      num: this.state.num - 1
    })
  }
  render() {
    return(
      <div>
        <p>销毁阶段的生命周期</p>
        <p>{ this.state.num }</p>
        <button onClick={ this.handleClick }>点击</button>
        <hr />
        { this.state.num === 0 ? '' : <Son /> }
      </div>
    )
  }
}

class Son extends React.Component {
  componentDidMount() {
    this.timer = setInterval(() => {
      console.log('hello')
    }, 1000)
  }
  componentWillUnmount() {
    console.log('我被销毁了!!!')
    clearInterval(this.timer)
  }
  render() {
    return (
      <div>
        <p>我是子组件</p>
      </div>
    )
  }
}

export default Handler